<!DOCTYPE html>
<html lang="zh-cn">
 
<head>
    <meta charset="utf-8">
	<base href="../../">
	<title>流程管理 - Powered By jiadao</title>
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
	<meta name="renderer" content="webkit"><meta http-equiv="X-UA-Compatible" content="IE=8,IE=9,IE=10" />
	<meta http-equiv="Expires" content="0"><meta http-equiv="Cache-Control" content="no-cache"><meta http-equiv="Cache-Control" content="no-store">
	<script src="js/jquery-1.8.3.min.js" type="text/javascript"></script>
	<link href="css/bootstrap.min.css" type="text/css" rel="stylesheet" />

	<link href="css/jquery.dataTables.min.css" type="text/css" rel="stylesheet" />
	<script src="js/jquery.dataTables.min.js" type="text/javascript"></script> 
	
	<script src="js/Sortable.js" type="text/javascript"></script>
	<script src="js/common.js" type="text/javascript"></script>
	<script src="js/vue.js"></script>

</head>
<body>

		<div id="app">
			
			<div class="container">
		
			<form id="inputForm" class="form"  method="post" onsubmit="return false;">
				
				<fieldset>
					<legend>流程基本信息</legend>
					<div class="form-group">
						<label class="control-label">流程名:</label>
						<div class="controls">
							<input v-model="name"  placeholder="流程名" class=" form-control required"  type="text" maxlength="200"/>
						</div>
					</div>
					<div class="form-group">
						<label class="control-label">流程key:</label>
						<div class="controls">
							<input v-model="key"  placeholder="流程key" class=" form-control required"  type="text" maxlength="200"/>
						</div>
					</div>
					<div class="form-group">
						<label class="control-label">流程描述:</label>
						<div class="controls">
							<input v-model="description"  placeholder="流程描述:" class=" form-control required" type="text"  maxlength="200"/>
						</div>
					</div>
					
				<div class="form-actions">
					<input id="btnSubmit" @click="createProcess" class="btn btn-primary" type="button"  value="保 存"/>&nbsp;
					</div>
			</form>
			</div>
		</div>
</body>

<script type="text/javascript">

	var data_get_url = 'api/fetch/fetchProcess'
	var data_save_url = '/process/modeler/create'

	var data ={
		id:0,
		name:'',
		key:'',
		description:''
	}
	var app = new Vue({
		el: '#app',
		data: data,

		mounted:function(){
			console.log('========')
			process_id = getUrlParam("id")
			if( typeof process_id != "undefined" && process_id != null ){
				
				$.ajax({
					type:"get",
					url:data_get_url,
					data:{id:process_id},
					success:function(ret){
						if(ret.code == CODE_SUCCESS){
							$.extend(data,ret.data)
							//setTimeout("$('form :input').attr('disabled','disabled')",600)
							
						}
					}
				})
			}
			
		},
		methods:{
			createProcess:function()  {
				if(data.name=="" || data.biz_key==""){
					alert("请填写流程名和key")
					return
				}
				$.ajax({
					type:'post',
					url:data_save_url,
					//data:JSON.stringify(data) ,
					data:data ,
					//contentType:"application/json;charset=UTF-8",
					success:function(ret){
						console.log(ret);
						if(ret.code==CODE_SUCCESS){
							app.id = ret.data;
							alert('创建成功')
						}
						else{
							alert('创建失败：'+ret.msg)
						}
					},
					error:function () {
						alert('发生错误：')
					}
				});
			}
		}
	})
</script>
</html>